import MyIcon from '@/components/MyIcon';
import ScrollBarLayout from '@/components/ScrollBarLayout';
import { getKeyRouter, tooltipLength } from '@/utils';
import { Empty, List, Tooltip } from 'antd';
import pageStyles from '@/common/pageLayout.less';
import { history } from 'umi';

export const DocumentHomeCheckPane: React.FC<DocumentationHomeAPI.IDocumentationHomeCheckPane> = ({
  styleClassName,
  documentationInfoList,
}) => {
  /** 点击跳转 */
  const onHandleSkip = (resObj: any) => {
    history.push({
      pathname: `/purchaseSourceController/dealHomePage/:${getKeyRouter()}${getKeyRouter()}`,
      state: {
        pageType: 'detail',
        id: resObj?.attributes.busi_id,
        pageInfo: {
          id: resObj?.attributes?.busi_id ? resObj?.attributes?.busi_id : null,
        },
        pIDDetailInfo: {
          ...resObj?.attributes,
          id: resObj?.attributes?.busi_id ? resObj?.attributes?.busi_id : null,
        },
      },
    });
  };

  return (
    <div className="commonTabsBodyDom" style={{ padding: '5px 0px' }}>
      {documentationInfoList && documentationInfoList?.length > 0 ? (
        <ScrollBarLayout style={{ padding: '0px 5px' }}>
          <List
            itemLayout="horizontal"
            dataSource={documentationInfoList}
            className={`${styleClassName}-homeListSty`}
            renderItem={(item) => {
              return (
                <List.Item
                  onClick={() => {
                    onHandleSkip(item);
                  }}
                >
                  <List.Item.Meta
                    avatar={
                      <div>
                        <MyIcon type="icon-caozuorizhi" style={{ fontSize: '40px' }} />
                      </div>
                    }
                    title={
                      <Tooltip placement="topLeft" title={tooltipLength(item?.attributes?.busi_projectName, 50)}>
                        <div className={`${styleClassName}-homeListSty-titleDiv`}>
                          <a className={pageStyles['over-flow-hidden']}>{item?.attributes?.busi_projectName || '--'}</a>
                          <div style={{ whiteSpace: 'nowrap', marginLeft: 10 }}>{item?.attributes?.busi_createTime || '--'}</div>
                        </div>
                      </Tooltip>
                    }
                    description={
                      <Tooltip placement="topLeft" title={tooltipLength(item?.attributes?.busi_purchProjectName, 50)}>
                        <div className={pageStyles['over-flow-hidden']}>{item?.attributes?.busi_purchProjectName || '--'}</div>
                      </Tooltip>
                    }
                  />
                </List.Item>
              );
            }}
          />
        </ScrollBarLayout>
      ) : (
        <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
      )}
    </div>
  );
};
